<nb-layout>
  <nb-layout-column>
    <section class="hero-image">
      <div class="content-center">
        <ngd-header [showSearch]="false"></ngd-header>
        <ngd-hero></ngd-hero>
      </div>
      <svg class="concave" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1920 222" preserveAspectRatio="xMidYMin slice">
        <g>
          <path d="M1920,0c-248.44,93.45-587.33,151.09-960.52,151.09S248.44,93.45,0,0V222H1920Z"/>
        </g>
      </svg>
    </section>

    <section class="for-business-section" [attr.aria-labelledby]="ngdForBusiness.headingId">
      <ngd-for-business #ngdForBusiness="ngdForBusiness"></ngd-for-business>
    </section>

    <section class="features">
      <div class="content-center">
        <ngd-icon-card *ngFor="let feature of features"
                       [routerLink]="feature.link"
                       [title]="feature.title"
                       [icon]="feature.icon"
                       [description]="feature.description">
        </ngd-icon-card>
      </div>
    </section>

    <section class="eva">
      <div class="eva-concave">
        <svg viewBox="0 0 1440 112" preserveAspectRatio="xMidYMin slice" xmlns="http://www.w3.org/2000/svg">
          <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
            <g transform="translate(0.000000, -720.000000)" fill="#FFFFFF">
              <path d="M1440,720.000142 L1440,830 C1440,831.104569 1439.10457,832 1438,832 L2,832 C0.8954305,832 1.3527075e-16,831.104569 0,830 L0,720 C192.489111,757.195808 444.350082,779.75851 720.000368,779.75851 C995.650302,779.75851 1247.51098,757.195865 1440,720.000142 Z" id="Combined-Shape"></path>
            </g>
          </g>
        </svg>
      </div>
      <ngd-eva class="content-center"></ngd-eva>
    </section>

    <section class="components-promo">
      <div class="content-center">
        <ngd-components-promo></ngd-components-promo>
      </div>
    </section>

    <section class="advantages">
      <div class="content-center">
        <ngd-text-card *ngFor="let advantage of advantages"
                       [title]="advantage.title"
                       [description]="advantage.description"
                       [icon]="advantage.icon">
        </ngd-text-card>
      </div>
    </section>

    <ngd-footer></ngd-footer>

  </nb-layout-column>
</nb-layout>
